import React from 'react';
import { useNavigate, useLocation } from 'react-router-dom';
import style from './index.module.scss';

const Tabs = () => {
    const navigate = useNavigate();
    const location = useLocation();
    return (
        <div className={style.tabs}>
            {['demo', 'demo2', 'home', 'page1', 'test', 'login', 'virtualScroll', 'breadcrumbDemo'].map((name) => (
                <div
                    className={location.pathname === `/${name}` ? 'active' : ''}
                    key={name}
                    onClick={() => navigate(`/${name}`)}
                >
                    {name} page
                </div>
            ))}
        </div>
    );
};

export default Tabs;
